import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutterdemo/common/calc.dart';
import 'package:flutterdemo/components/button.dart';
import 'package:flutterdemo/components/img.dart';

class ShopPage extends StatefulWidget {
  ShopPage({Key? key}) : super(key: key);

  @override
  _ShopPageState createState() => _ShopPageState();
}

class _ShopPageState extends State<ShopPage>
    with AutomaticKeepAliveClientMixin {
  @override
  // TODO: implement wantKeepAlive
  bool get wantKeepAlive => true;

  // 购物车每一项
  Widget _shopItemWidget() {
    return Ink(
      decoration: BoxDecoration(borderRadius: BorderRadius.circular(Calc.width(20)),
      color: Colors.white,
      
      ),
      child: InkWell(
        onTap: () {
          Navigator.pushNamed(context, "shopInfo");
        },
        child: Column(
          children: [
            Row(
              children: [
                Container(
                  padding: EdgeInsets.all(Calc.width(20)),
                  width: Calc.width(240),
                  height: Calc.width(220),
                  child: ClipRRect(
                    borderRadius: BorderRadius.circular(Calc.width(10)),
                    child: Img(
                        "https://img2.baidu.com/it/u=961315293,3283186870&fm=26&fmt=auto"),
                  ),
                ),
                Column(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      "精品推拉门",
                      style: TextStyle(fontSize: 16,fontWeight: FontWeight.w700),
                    ),
                    SizedBox(
                      height: Calc.width(5),
                    ),
                    Text("宽度:  600*544"),
                    SizedBox(
                      height: Calc.width(5),
                    ),
                    Text("规格:  豪华酒红 80框"),
                    SizedBox(
                      height: Calc.width(5),
                    ),
                    Text(
                      "价格:￥99",
                      style: TextStyle(color: Colors.red),
                    ),
                  ],
                ),
              ],
            ),
            Padding(
              padding: EdgeInsets.all(Calc.width(20)),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.end,
                children: [
                  Icon(
                    Icons.delete_forever_sharp,
                    color: Colors.red,
                  )
                ],
              ),
            )
          ],
        ),
      ),
    );
  }

  // 底部控件
  Widget bottomW() {
    return Container(
      height: Calc.height(100),
      padding: EdgeInsets.only(left: Calc.width(30), right: Calc.width(30)),
      decoration: BoxDecoration(
        color: Colors.white,
        border: Border(
          top: BorderSide(
            color: Color.fromRGBO(233, 233, 233, 1),
            width: 1,
            style: BorderStyle.solid
          )
        )
      ),
      child: Row(
        children: [
          Text("合计:"),
          Expanded(
            flex: 1,
            child: Text(
              "￥129",
              style: TextStyle(color: Colors.red),
            ),
          ),
          MyButton(
            "去结算",
            onPressed: () {},
          )
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    Calc.init(context);

    return Column(
      children: [
        Expanded(
          flex: 1,
          child: Ink(
            color: Color.fromRGBO(233, 233, 233, 1),
            child: ListView(
              physics: BouncingScrollPhysics(),
              padding:
                  EdgeInsets.all(Calc.width(20)),
              children: [
                _shopItemWidget(),
                SizedBox(height: Calc.width(20)),
                _shopItemWidget(),
                SizedBox(height: Calc.width(20)),
                _shopItemWidget(),
                SizedBox(height: Calc.width(20)),
                _shopItemWidget(),
                SizedBox(height: Calc.width(20)),
                _shopItemWidget(),
                SizedBox(height: Calc.width(20)),
                _shopItemWidget(),
                SizedBox(height: Calc.width(20)),
                _shopItemWidget(),
                SizedBox(height: Calc.width(20)),
                _shopItemWidget(),
                SizedBox(height: Calc.width(20)),
              ],
            ),
          ),
        ),
        bottomW(),
      ],
    );
  }
}
